﻿@{
    ViewBag.Title = "ThemMoi";
    Layout = "~/Views/Shared/Admin/_AdminLayout.cshtml";
}
@model BabyToys.Models.SanPham
<script src="~/ckeditor/ckeditor.js"></script>
<script src="~/Scripts/jquery-1.4.1.min.js"></script>
<script type="text/javascript">
    var countries = new ddtabcontent("countrytabs")
    countries.setpersist(true)
    countries.setselectedClassTarget("link") //"link" or "linkparent"
    countries.init()
</script>
@using (Html.BeginForm("Sua", "AdminSanPham", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
<div style="background: #fff; text-align: right; height: 40px; width: 100%; border: 1px solid #ccc;">
    <span style="font-size: 18px; font-weight: bold; float: left; padding-top: 17px;padding-left: 15px;">
        THÊM SẢN PHẨM</span>
    <table style="float: right; font-size: 11px; color: #262626;">
        <tr>
            <td class="control">
                <input type="submit" name="sua" class="large button green input" value="Lưu và thoát">
            </td>
            <td class="control">
                <input type="submit" name="sua" class="large button blue input" value="Lưu và tiếp tục">
            </td>
            <td class="control">
                <input type="submit" class="large button black input" value="Đóng">
            </td>

        </tr>
    </table>
</div>
    <br />
<div class="Main_nhap" style="">
    <div class="Main_nhap_left">
        <div style="padding-top: 10px;">
            <div style="padding-left: 20px; height: 22px;">
                <ul id="countrytabs" class="shadetabs">
                    <li><a rel="country1" class="selected">Thông tin sản phẩm</a></li>
                    <li><a rel="country2">Hình ảnh</a></li>
                    <li><a rel="country3">Thuộc tính</a></li>
                </ul>
            </div>
            <div style="border: 1px solid #ccc; background: #e7e7e7; width: 99%; padding: 8px; min-height: 200px; text-shadow: #fff 0px 1px 0px;">
                <div id="country1" class="tabcontent">
                    <table class="Conten_main_sanpham" cellpadding="0" cellspacing="0" style="border: 1px solid #fff;">
                        <tr class="row">
                            <td class="box_title">Mã sản phẩm</td>
                            <td class="box_object">
                                @Html.TextBoxFor(model => model.MaSP, new { @class = "input_text", style = "width:300px" })
                                @Html.HiddenFor(model=>model.IdSanPham)
                                <span class="error">@Html.ValidationMessageFor(model => model.MaSP)</span>
                            </td>
                        </tr>
                        <tr class="row">
                            <td class="box_title">Tên sản phẩm</td>
                            <td class="box_object">
                                @Html.TextBoxFor(model => model.TenSP, new { @class = "input_text", style = "width:300px" })
                                <span class="error">@Html.ValidationMessageFor(model => model.TenSP)</span>
                            </td>
                        </tr>
                        <tr class="row">
                            <td class="box_title">Danh mục sản phẩm</td>
                            <td class="box_object">
                                @Html.DropDownList("IdDanhMuc", "Chọn danh mục")
                                <span class="error">@Html.ValidationMessageFor(model => model.IdDanhMuc)</span>
                            </td>
                        </tr>
                        <tr class="row">
                            <td class="box_title">Nhà sản xuất</td>
                            <td class="box_object">
                                @Html.DropDownList("IdThuongHieu")
                                <span class="error">@Html.ValidationMessageFor(model => model.IdThuongHieu)</span>
                            </td>
                        </tr>
                        <tr class="row">
                            <td class="box_title">Số lượng</td>
                            <td class="box_object">
                                @Html.TextBoxFor(model => model.SoLuong, new { @class = "input_text", style = "width:100px" })
                                <span class="error">@Html.ValidationMessageFor(model => model.SoLuong)</span>
                            </td>
                        </tr>
                        <tr class="row">
                            <td class="box_title">Giá bán</td>
                            <td class="box_object">
                                @Html.TextBoxFor(model => model.Giaban, new { @class = "input_text", style = "width:200px" }) VNĐ
                                <span class="error">@Html.ValidationMessageFor(model => model.Giaban)</span>
                            </td>
                        </tr>
                        <tr class="row">
                            <td class="box_title">Giá khuyến mãi</td>
                            <td class="box_object">
                                @Html.TextBoxFor(model => model.GiaKM, new { @class = "input_text", style = "width:200px" }) VNĐ
                                <span class="error">@Html.ValidationMessageFor(model => model.GiaKM)</span>
                            </td>
                        </tr>
                        <tr class="row">
                            <td class="box_title">Hiển thị</td>
                            <td class="box_object">
                                @Html.CheckBoxFor(model=>model.HienThi)<small>Cho phép hiển thị sản phẩm</small>
                            </td>
                        </tr>
                        <tr class="row">
                            <td class="box_title">Chọn hình đại diện</td>
                            <td class="box_object">
                                <img src="~/Content/Images/SanPham/@Model.Thumbnail" />
                                <br />
                                @Html.HiddenFor(model=>model.HinhDaiDien)
                                @Html.HiddenFor(model=>model.Thumbnail)
                                <input type="file" name="anhdaidien" id="anhdaidien" class="input-xxlarge">
                            </td>
                        </tr>
                        <tr class="row">
                            <td class="box_title">Mô tả</td>
                            <td class="box_object">
                                @Html.TextAreaFor(model => model.MoTaSP, new { rows = "5", cols = "10", id = "ckemota" })
                                <script type="text/javascript">
                                    var ckeditor1 = CKEDITOR.replace("ckemota")
                                    ckeditor1.config.width = 700;
                                    ckeditor1.config.height = 200;
                                </script>
                            </td>
                        </tr>
                    </table>
                </div>
                <div id="country2" class="tabcontent">
                   <div style="float:left;padding-left:30px;">
                        Hình ?nh chi ti?t cho s?n ph?m<br />
                        <small>Upload t?i da @ViewBag.SoHinhCoTheUp hình</small>
                        <br />
                        <br />
                        <input type="submit" name="sua" class="large button green input" value="Upload">
                        <br />
                        @for (int i = 0; i < ViewBag.SoHinhCoTheUp; i++)
                        {
                            <div id="uploadFile_div">
                                <label class="control-label" for="inputEmail">Chọn hình</label>
                                @{string tenimg = "preview" + i;}
                                <img id="@tenimg" src="~/Content/Images/SanPham/noimageyet.jpg" width="50px" height="50px"/>
                                <a id="xoa @i" onclick="clearFileInputField('uploadFile_div',@i)" href="#" style="visibility:hidden">xóa</a>
                                <input type="file" class="input-xxlarge" id="anh @i" name="anh @i" onchange="readURL(this,@i)">
                            </div>
                        <br />
                        }
                    <script>
                        function clearFileInputField(tagId, i) {
                            document.getElementById(tagId).innerHTML =
                                            document.getElementById(tagId).innerHTML;
                            $('#preview' + i).attr('src', "/Content/Images/SanPham/noimageyet.jpg");
                            document.getElementById("xoa " + i).style.visibility = "hidden";
                        }
                        function readURL(input, i) {
                            if (input.files && input.files[0]) {
                                var reader = new FileReader();

                                reader.onload = function (e) {
                                    $('#preview' + i).attr('src', e.target.result);
                                }

                                reader.readAsDataURL(input.files[0]);
                            }
                            document.getElementById("xoa " + i).style.visibility = "visible";
                        }
                        $("#anh").change(function () {
                            alert("change");
                        });
                                </script>
                    </div>
                    <div style="float:right;padding:30px;padding-left:50px;width:40%;">
                         <table>
                            <tr class="item_title" style="color:White;background-color:#CCCCCC;font-family:Tahoma;font-size:12px;font-weight:bold;height:30px;">
                                <th>Hình</th>
                                <th>Tên</th>
                                <th></th>
                            </tr>
                            @foreach (var hinh in ViewBag.HinhAnh)
                            {
                                <tr>
                                    <td class="">
                                        <img src="~/Content/Images/SanPham/@hinh.AnhGoc" width="100px" height="100px"/>
                                    </td>
                                    <td class="item_float">@hinh.AnhGoc</td>
                                    <td class="item_float"><a href="~/AdminSanPham/XoaAnh/?id=@hinh.ID&IdSanPham=@Model.IdSanPham">Xóa</a></td>
                                </tr>
                            }
                        </table>
                    </div>
                    <div style="clear:both;"></div>
                </div>
                <div id="country3" class="tabcontent">
                    <table class="Conten_main_sanpham" cellpadding="0" cellspacing="0" style="border: 1px solid #fff;">
                        <tr class="row">
                            <td class="box_title">Chất liệu</td>
                            <td class="box_object">
                                @Html.TextBoxFor(model => model.ChatLieu, new { @class = "input_text", style = "width:300px" })
                            </td>
                        </tr>
                        <tr class="row">
                            <td class="box_title">Màu sắc</td>
                            <td class="box_object">
                                @Html.TextBoxFor(model => model.MauSac, new { @class = "input_text", style = "width:300px" })
                            </td>
                        </tr>
                        <tr class="row">
                            <td class="box_title">Kích thước</td>
                            <td class="box_object">
                                @Html.TextBoxFor(model => model.KichThuoc, new { @class = "input_text", style = "width:300px" })
                            </td>
                        </tr>
                 </table>
                </div>
            </div>
        </div>
    </div>
</div>
}
<script type="text/javascript">

    var countries = new ddtabcontent("countrytabs")
    countries.setpersist(true)
    countries.setselectedClassTarget("link") //"link" or "linkparent"
    countries.init()
</script>


@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

